<ion-header>
    <ion-toolbar content-page>
        <ion-buttons start>
            <button ion-button icon-only (click)="backToProPage()">
                <i class="icon-back"></i>
            </button>
        </ion-buttons>
        <ion-title>客户详情</ion-title>
        <ion-buttons end>
            <button ion-button icon-only (click)="collectClickHandle()">
                <i [ngClass]="{'icon-favorites': isFavorited, 'icon-favorites-no': !isFavorited}"></i>
                <span class="text-favorites">{{isFavorited?"已收藏":"收藏"}}</span>
            </button>
        </ion-buttons>
    </ion-toolbar>
    <div class="base-info">
        <div class="baseMessage">
            <!--<div class="part1 part">-->
            <!--<img src="{{clientAvatar}}" *ngIf="clientAvatar"/>-->
            <!--</div>-->
            <div class="part2 part">
                <img *ngIf="clientsData.vipFlag=='1'" src="./assets/images/client/client-detail/icon_vip_gold_b.png"/>
                <img *ngIf="clientsData.vipFlag=='2'"
                     src="./assets/images/client/client-detail/icon_vip_platinum_b.png"/>
                <img *ngIf="clientsData.vipFlag=='3'"
                     src="./assets/images/client/client-detail/icon_vip_diamond_b.png"/>
                <img *ngIf="clientsData.vipFlag=='4'"
                     src="./assets/images/client/client-detail/icon_vip_supreme_b.png"/>
            </div>
            <div class="part3 part">
                <div class="part3 part">
                    <p class="name" [ngClass]="{'is-death':clientsData.deathFlag === 'Y'}" >
                        <span>{{clientsData.name?clientsData.name:''}}</span>
                    </p>
                    <p class="age">
                        <img src="{{clientAvatar}}" *ngIf="clientAvatar" class="sexCode"/>
                        <span *ngIf="clientsData.age">{{clientsData.age}}岁</span>
                    </p>
                </div>
            </div>
            <div class="part4 part">
                <i class="note" (click)="goToNote(currentClientNum)"></i>
                <i class="go-map" (click)="goMap()"></i>
                <i class="phone" (click)="onePhoneCall()"
                   *ngIf="clientsData.mobilePhone && clientsData.mobilePhone.length>0&&clientsData.mobilePhone[0].mobile">
                    <span *ngIf="clientsData.mobilePhone.length>1">
                        <ion-select interface="action-sheet" cancelText="取消" class="phoneList">
                        <ion-option *ngFor="let one of clientsData.mobilePhone index as index"
                                    (ionSelect)="callPhone(one.mobile)">{{one.mobile}}</ion-option>
                    </ion-select>
                    </span>
                </i>
            </div>
        </div>
    </div>
</ion-header>
<ion-content>
    <div class="main-content">
        <div class="panel panel-border">
            <div class="con-grid">
                <div class="con-col col1" (click)="goToPolicyDetail(clientsData.totalPolicy)">
                    <div class="col-title">保单</div>
                    <div class="col-content">{{clientsData.totalPolicy?clientsData.totalPolicy:''}}</div>
                </div>
                <div class="con-col col2">
                    <div class="col-title">年缴保费</div>
                    <div class="col-content">{{clientsData.premium | numberTrans:1}}</div>
                </div>
                <div class="con-col col3" (click)="goToClientClaim(clientsData.totalClaim)">
                    <div class="col-title">理赔</div>
                    <div class="col-content">{{clientsData.totalClaim?clientsData.totalClaim:''}}</div>
                </div>
                <div class="clear-float"></div>
            </div>
        </div>
        <!-- 销售线索 -->
        <div class="panel panel-border saleLeads">
            <p>销售线索</p>
            <p class="signList"><span *ngFor="let a of leadsList" (click)="goToleadsList(a)">{{a}}</span> <span
                class="leadsMore">…</span></p>
        </div>
        <div class="panel panel-border">
            <div class="panel">
                <div class="panel-title">
                    <span>基本信息</span>
                    <button type="button" (click)="goToEdit()">
                     <span>
                            <i class="icon-edit"></i>编辑
                        </span>
                    </button>
                </div>
                <div class="panel-item">
                    <span>姓名</span>
                    <span>{{clientsData.name?clientsData.name:''}}</span>
                </div>
                <div class="panel-item">
                    <span>性别</span>
                    <span>{{clientsData.sex? (clientsData.sex=='M'?'男':'女') :''}}</span>
                </div>
                <div class="panel-item">
                    <span>生日</span>
                    <span>{{clientsData.birthDate | dateTrans:'YYYY/MM/DD'}}</span>
                </div>
                <div class="panel-item"
                     *ngFor="let phone of (clientsData.mobilePhone && clientsData.mobilePhone.length>0&&clientsData.mobilePhone[0].mobile)?clientsData.mobilePhone:[''] index as index">
                    <span>电话{{index>=1?index+1:''}}</span>
                    <span class="phoneNum">{{phone.mobile}}</span>
                </div>
                <div
                    *ngFor="let address of (clientsData.addressList && clientsData.addressList.length>0)?clientsData.addressList:emptyAddress index as index">
                    <div class="panel-item word-break">
                        <span>地址{{index>=1?index+1:''}}</span>
                        <span  class="address">{{address.address? address.address:''}}
                        <span *ngIf="address.defaultIndicator==1">
                                (定位)
                            </span>
                        </span>
                    </div>
                    <div class="panel-item">
                        <span>邮编</span>
                        <span>{{address.postCode}}</span>
                    </div>
                </div>
                <div class="panel-item">
                    <span>证件有效期</span>
                    <span>{{checkIdDate(clientsData.idExpiryDate) | dateTrans:'YYYY/MM/DD'}}</span>                </div>
            </div>
            <div class="toggle-panel">
                <div class="toggle-head">
                    <button (click)="changeOtherInfoOpenStatus()">
                        <!--<span>{{otherInfoOpenStatus?'收起':'展开'}}</span>-->
                        <i [ngClass]="otherInfoOpenStatus?'up':'down'"></i>
                    </button>
                </div>
                <div [ngStyle]="{display:otherInfoOpenStatus?'block':'none'}" class="panel">
                    <div class="panel-item">
                        <span>月收入</span>
                        <span>{{clientsData.income | monthlyIncome}}</span>
                    </div>
                    <div class="panel-item word-break">
                        <span>职业类别</span>
                        <span>{{clientsData.occupationType?clientsData.occupationType:'未知'}}</span>
                    </div>
                    <div class="panel-item word-break">
                        <span>职业</span>
                        <span>{{clientsData.occupationDesc?clientsData.occupationDesc:'未知'}}</span>
                    </div>
                    <div class="panel-item">
                        <span>婚育</span>
                        <span>{{getMarriageType()}}</span>
                        <!--<span>{{clientsData.marriageType?clientsData.marriageType:'未知'}}</span>-->
                    </div>
                    <div class="panel-item">
                        <span>子女</span>
                        <span>{{clientsData.childNum?child[clientsData.childNum]:'未知'}}</span>
                    </div>
                    <div class="panel-item">
                        <span>住房</span>
                        <span>{{clientsData.houseOwnership?(clientsData.houseOwnership==1?'租房':'自有'):'未知'}}</span>
                    </div>
                    <div class="panel-item">
                        <span>私家车</span>
                        <span>{{clientsData.carOwnership?(clientsData.carOwnership==1?'有':'无'):'未知'}}</span>
                    </div>
                    <div class="panel-item">
                        <span>是否在其他公司购买保险</span>
                        <span>{{clientsData.otherIns?(clientsData.otherIns==1?'有':'无'):'未知'}}</span>
                    </div>
                    <div class="panel-item" *ngIf="clientsData.otherIns&&clientsData.otherIns==1">
                        <span>购买类型</span>
                        <span>{{clientsData.insType?inType[clientsData.insType]:'未知'}}</span>
                    </div>
                    <!--<div class="panel-item no-border">-->
                    <!--<span>客户来源</span>-->
                    <!--<span>{{clientsData.source?clientsData.source:'未知'}}</span>-->
                    <!--</div>-->
                </div>
            </div>
        </div>
        <!--<div class="panel">-->
        <!--<div class="panel-title">备注</div>-->
        <!--<div class="panel-item no-border">-->
        <!--<span>{{clientsData.remark?clientsData.remark:''}}</span>-->
        <!--<span></span>-->
        <!--</div>-->
        <!--</div>-->
        <!--<client-detail-progress *ngIf="getProgress.clientId" [progressList]="progressList" (detail)="goToNote(currentClientNum)"></client-detail-progress>-->
    </div>
</ion-content>
